// dark皮肤
[data-theme=dark] {
  // logo样式
  .layout-aside .logo {
    border-bottom: none;
    h1 {
      color: #ffffff;
    }
  }
  // menu样式
  .bin-menu {
    .bin-menu-item {
      color: $color-text-white-light;
      background: getMenuBg();
      &.is-disabled {
        background: getMenuBg() !important;
        opacity: .9;
        &:hover {
          color: $color-text-white-light;
        }
      }
      &:hover {
        color: $color-text-white;
      }
      &.is-active {
        color: $color-text-white;
        background: getColor();
      }
    }
    .bin-submenu__title {
      color: $color-text-white-light;
      background: getMenuBg();
      &:hover {
        color: $color-text-white;
      }
    }
    .bin-menu-item-group__title {
      color: $color-text-white-disable;
      background: getMenuBgActive();
    }
    .bin-submenu .bin-menu--inline {
      .bin-menu-item, .bin-submenu__title {
        background: getMenuBgActive();
      }
      .bin-menu-item {
        &.is-active {
          color: $color-text-white;
          background: getColor();
        }
      }
    }
    // 收起菜单的样式
    &.bin-menu--collapse {
      .bin-menu-item {
        &.is-active {
          color: getColor();
          background: getMenuBgActive();
          &::after {
            position: absolute;
            top: 0;
            left: 0;
            width: 2px;
            height: 100%;
            background-color: getColor();
            content: '';
            z-index: 1;
          }
        }
      }
      .bin-submenu.is-active {
        .bin-submenu__title {
          color: getColor();
          background: getMenuBgActive();
        }
        &::before {
          position: absolute;
          top: 0;
          left: 0;
          width: 2px;
          height: 100%;
          background-color: getColor();
          content: '';
          z-index: 1;
        }
      }
    }
    &.bin-menu--horizontal {
      .bin-menu-item {
        color: $color-text-white-light;
        background: getMenuBg();
        &:hover {
          color: $color-text-white;
        }
        &.is-active {
          color: $color-text-white;
          background: getColor();
          border-bottom-color: getColor();
        }
      }
      .bin-submenu {
        .bin-submenu__title {
          &:not(.is-disabled):hover, &:not(.is-disabled):focus {
            color: $color-text-white;
            background: getMenuBg() !important;
          }
          &:hover {
            color: $color-text-white;
            background: getMenuBg() !important;
          }
        }
        &.is-active {
          .bin-submenu__title {
            border-bottom-color: getColor();
            color: getColor();
          }
        }
      }
    }
  }
  // menu-popup
  .bin-menu--popup {
    background: getMenuBg();
    .bin-menu-item, .bin-submenu__title {
      color: $color-text-white-light;
      background: getMenuBg();
      &:hover {
        color: $color-text-white;
      }
      &.is-active {
        color: $color-text-white;
        background: getColor();
      }
    }
  }
}

